[#macro shopListView]
<div>
    <el-dialog title="提示" :visible.sync="dialogVisible" width="30%">
        <span>确认要删除该条数据吗?</span>
        <span slot="footer" class="dialog-footer">
            <el-button @click="dialogVisible = false">取 消</el-button>
            <el-button type="primary" @click="handleClose">确 定</el-button>
        </span>
    </el-dialog>
    <el-dialog title="提示" :visible.sync="auditVisible" width="30%">
        <el-form ref="ruleForm" :rules="rules" :model="form" label-width="80px">
            <el-row :gutter="10">
                <el-col :span="24">
                    <el-form-item label="门头" size="mini" prop="logo">
                        <avatar v-model="form.logo"></avatar>
                    </el-form-item>
                </el-col>
                <el-col :span="24">
                    <el-form-item label="商家名称" size="mini" prop="name">
                        <el-input v-model="form.name" name="name">
                        </el-input>
                    </el-form-item>

                </el-col>
                <el-col :span="24">
                    <el-form-item label="审核状态" size="mini" prop="auditState">
                        <el-radio-group v-model="form.auditState">
                            <el-radio label="checked">通过</el-radio>
                            <el-radio label="fail">驳回</el-radio>
                        </el-radio-group>
                    </el-form-item>
                </el-col>
                <el-col :span="24" v-if="form.auditState=='fail'">
                    <el-form-item label="驳回理由" size="mini" prop="msg">
                        <el-input type="textarea" :rows="2" placeholder="请输入内容" v-model="form.msg">
                        </el-input>
                    </el-form-item>
                </el-col>

            </el-row>
        </el-form>
        <span slot="footer" class="dialog-footer">
            <el-button @click="auditVisible = false">取 消</el-button>
            <el-button type="primary" @click="handleAuditClose">确 定</el-button>
        </span>
    </el-dialog>
    <div class="search">
        <el-form label-width="80px">
            <el-row>
                <el-col :span="6" style="padding: 0 8px;">
                    <el-form-item label="商家名称">
                        <el-input v-model="searchObject.name" size="small" placeholder="商家名称" name="name">
                        </el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="6" style="padding: 0 8px;">
                    <el-form-item label="地址">
                        <el-input v-model="searchObject.address" size="small" placeholder="地址" name="address">
                        </el-input>
                    </el-form-item>
                </el-col>

                <el-col :span="12" style="padding: 0 10px;margin-top: 5px;">
                    <el-row type="flex" justify="end">
                        <el-button size="small" type="primary" @click="search">搜索</el-button>
                        <el-button size="small" plain @click="clearData">清除条件</el-button>
                    </el-row>
                </el-col>
            </el-row>
        </el-form>
    </div>
    <div class="data-content">
        <el-menu :default-active="activeIndex" class="el-menu-demo" mode="horizontal" @select="handleSelect">
            <el-menu-item index="1">
                已审核商家
            </el-menu-item>
            <el-menu-item index="2">
                待审核商家
            </el-menu-item>
            <el-menu-item index="3">
                审核失败商家
            </el-menu-item>
            <el-menu-item index="4">
                所有商家
            </el-menu-item>
            <el-menu-item index="5">
                回收站
            </el-menu-item>
        </el-menu>
        <div class="tool-add" style="margin-top: 15px;">
            <el-button type="primary" size="small" @click="addView">新增</el-button>
        </div>

        <el-table v-loading="loading" :data="tableData.list" show-summary  :summary-method="getSummaries"  @cell-click="showView" @sort-change="changeTableSort"
            style="width: 100%;font-size: 12px;">
            <el-table-column label="商家名称" prop="name" show-overflow-tooltip width="200">
            </el-table-column>
            <el-table-column label="所属分类" prop="shopCatalogName" width="100">
            </el-table-column>
            <el-table-column label="排序号" prop="sortNum" sortable="custom" width="100">
            </el-table-column>
            <el-table-column label="基础销量" prop="baseSaleNum" width="100">
            </el-table-column>
            <el-table-column label="销量数量" prop="saleNum" sortable="custom"  width="100">
            </el-table-column>
            <el-table-column label="员工人数" prop="staffNum" width="100">
            </el-table-column>
            <el-table-column label="账户余额" prop="tradeAccountAmount" width="100">
            </el-table-column>
            <el-table-column label="状态" prop="shopStateName" width="100">
            </el-table-column>
            <el-table-column label="创建时间" prop="addDate">
            </el-table-column>
            <el-table-column width="180" align="center" fixed="right" label="操作">
                <template slot-scope="scope">
                    <el-button type="text" size="mini" icon="el-icon-info" @click="show(scope.row)">详情
                    </el-button>
                    <el-button v-if="activeIndex=='2'" type="text" size="mini" icon="el-icon-edit"
                        @click="auditView(scope.row)">审核
                    </el-button>
                    <el-button type="text" size="mini" icon="el-icon-edit" @click="editView(scope.row)">编辑
                    </el-button>

                    <el-button type="text" v-if="scope.row.storeState=='normal'" icon="el-icon-delete" class="danger"
                        size="mini" style="cursor: pointer;" @click="deleteData(scope.row)">删除
                    </el-button>
                    <el-button type="text" v-else icon="el-icon-delete" class="danger"
                        size="mini" style="cursor: pointer;" @click="restoreData(scope.row)">还原
                    </el-button>
                </template>
            </el-table-column>
        </el-table>

        <div class="page">
            <el-pagination background :current-page="searchObject.no" :page-sizes="[10, 20, 50, 100]"
                :page-size="tableData.size" :pager-count="5" layout="total, sizes, prev, pager, next, jumper"
                :page-count="tableData.totalPage" :total="tableData.total" @size-change="sizeChange"
                @current-change="pageChange">
            </el-pagination>
        </div>
    </div>
</div>
[/#macro]
[#macro shopListConfig]
<script type="text/x-template" id="my-shop-list">
	[@shopListView /]
</script>
<script type="text/javascript">
    var shopListConfig = {};
    shopListConfig.template = "#my-shop-list";
    shopListConfig.methods = config.basicMethod();


    shopListConfig.methods.addView = function () {
        this.$router.push({ path: 'add' });
    }
    shopListConfig.methods.auditView = function (row) {
        this.selectData = row;
        this.auditVisible = true;
        this.form.name = row.name;
        this.form.logo = row.logo;
        this.form.id = row.id;

        this.form.auditState = "";
    }


    shopListConfig.methods.editView = function (row) {
        var self = this;
        var data = {};
        data.id = row.id;
        this.$router.push({ path: 'update', query: data });

    }

    shopListConfig.methods.changeTableSort = function (column) {
        this.searchObject.sortField = column.prop;
        if ("descending" == column.order) {
            this.searchObject.sortMethod = "desc";
        }
        else if ("ascending" == column.order) {
            this.searchObject.sortMethod = "asc";
        }
        else {
            this.searchObject.sortMethod = "";
        }
        this.getSearchList();
    }
    shopListConfig.methods.showView = function (row, column, cell, event) {
        if (cell.cellIndex >= 0) {
            return;
        }
        var param = {};
        param.id = row.id;
        var self = this;
        this.$router.push({ path: 'view', query: param });

    }
    shopListConfig.methods.show = function (row) {
        var param = {};
        param.id = row.id;
        var self = this;
        this.$router.push({ path: 'view', query: param });

    }

    shopListConfig.methods.getSummaries = function (param) {
        const { columns, data } = param;
        const sums = [];
        columns.forEach((column, index) => {
            if (index === 0) {
                sums[index] = '总价';
                return;
            }

            if (index !== 6) {
                sums[index] = '';
                return;
            }
            const values = data.map(item => Number(item[column.property]));
            if (!values.every(value => isNaN(value))) {
                sums[index] = values.reduce((prev, curr) => {
                    const value = Number(curr);
                    if (!isNaN(value)) {
                        return prev + curr;
                    } else {
                        return prev;
                    }
                }, 0);
                var money=sums[index];
                if(money.toFixed){
                    sums[index] =money.toFixed(2)+ ' 元';
                }else{
                    sums[index] += ' 元';
                }
            } else {
                sums[index] = 'N/A';
            }
        });

        return sums;
    };

    shopListConfig.methods.handleSelect = function (index) {
        if (index == "1") {
            this.searchObject.auditState = "checked"
            this.searchObject.storeState = "normal";
        } else if (index == "2") {
            this.searchObject.auditState = "wait"
            this.searchObject.storeState = "normal";
        } else if (index == "3") {
            this.searchObject.auditState = "fail"
            this.searchObject.storeState = "normal";
        } else if (index == "4") {
            this.searchObject.auditState = ""
            this.searchObject.storeState = "normal";
        } else if (index == "5") {
            this.searchObject.auditState = ""
            this.searchObject.storeState = "recycle";
        } else {
            this.searchObject.auditState = ""
            this.searchObject.storeState = "normal";
        }
        this.activeIndex = index;
        this.getSearchList();
    }

    shopListConfig.methods.sizeChange = function (event) {
        this.searchObject.size = event;
        this.getSearchList();
    }
    shopListConfig.methods.pageChange = function (index) {
        this.searchObject.no = index;
        this.getSearchList();
    }
    shopListConfig.methods.getSearchList = function () {
        this.loading = true;
        var data = this.searchObject, that = this;
        $.post("${siteurl}tenantRest/shop/search.htm", data, function (result) {
            if (result.code == 0) {
                that.tableData = result;
            }
            setTimeout(function () {
                that.loading = false;
            }, 300)
        });
    }
    shopListConfig.methods.search = function () {
        this.searchObject.no = 1;
        this.getSearchList();
    }
    shopListConfig.methods.clearData = function () {
        this.searchObject.name = "";
        this.searchObject.address = "";
        this.searchObject.shopState = "";
    }
    shopListConfig.methods.deleteData = function (event) {
        this.selectId = event.id;
        this.dialogVisible = true;
    }

    shopListConfig.methods.handleClose = function (done) {
        this.dialogVisible = false;
        var self = this;
        if (self.selectId) {
            var params = {};
            params.id = self.selectId;
            this.postData("${siteurl}tenantRest/shop/delete.htm", params, function (res) {
                if (res.code == 0) {
                    self.$message({
                        message: '删除数据成功',
                        type: 'success'
                    });
                    self.getSearchList();
                } else {
                    self.$message.error(res.msg);
                }
            });
        }

    }
    shopListConfig.methods.restoreData = function (event) {
        this.selectId = event.id;
        var self = this;
        if (self.selectId) {
            var params = {};
            params.id = self.selectId;
            params.storeState="normal"
            this.postData("${siteurl}tenantRest/shop/update.htm", params, function (res) {
                if (res.code == 0) {
                    self.$message({
                        message: '还原成功',
                        type: 'success'
                    });
                    self.getSearchList();
                } else {
                    self.$message.error(res.msg);
                }
            });
        }

    }
    

    shopListConfig.methods.handleAuditClose = function (done) {

        var self = this;
        this.postData("${siteurl}tenantRest/shop/audit.htm", self.form, function (res) {
            if (res.code == 0) {
                self.$message({
                    message: '审核成功',
                    type: 'success'
                });
                //window.history.go(-1)
                self.auditVisible = false;
                self.getSearchList();
            } else {
                self.$message.error(res.msg);
            }
        });
    }


    shopListConfig.computed = {};

    shopListConfig.data = function () {
        return {
            searchObject: {
                no: 1,
                size: 10,
                name: '',
                address: '',
                shopState: '',
                auditState: "checked"
            },
            dialogVisible: false,
            auditVisible: false,
            defaultProps: {
                children: 'children',
                label: 'name'
            },
            loading: false,
            tableData: {},
            activeIndex: "1",
            form: {
                logo: '',
                name: '',
                shopCatalog: '',
                sortNum: '',
                boss: '',
                address: '',
                tel: '',
                auditState: ""
            },
            rules: {
                name: [
                    { required: true, message: '请输入商家名称', trigger: 'blur' }
                ],
            }
        }
    };
    shopListConfig.methods.showAddView = function () {
        this.$router.push({ path: 'add' });
    };
    shopListConfig.mounted = function () {

    }
    shopListConfig.activated = function () {
        this.getSearchList();
    }
    var shopListView = Vue.component('list-shop-view', shopListConfig);
</script>
[/#macro]